import React from 'react';
import DataTable from '../../UI/DataTable';
import PageContainer from '../../UI/PageContainer';
import './ProjectPage.css';

const ProjectPage = () => {
  const data = [
    {
      id: 1,
      projectTitle: '基于人工智能的智能医疗诊断系统',
      projectID: 'PROJ001',
      projectType: '国家自然科学基金',
      participants: '张三',
      projectOrg: '某某大学',
      status: '某某医院',
      startDate: '2023-01-01',
      endDate: '2025-12-31',
      funding: '50万元',
      state: '在研',
      money: '50万元',
      files_projectProposal: [
        { name: '项目申请书.pdf', size: 5120000, type: 'application/pdf' },
        { name: '研究计划.docx', size: 2048000, type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' }
      ],
      files_progressReport: [
        { name: '中期报告.pdf', size: 3072000, type: 'application/pdf' },
        { name: '实验数据.xlsx', size: 1536000, type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }
      ],
      files_achievement: [
        { name: '论文发表.pdf', size: 2048000, type: 'application/pdf' },
        { name: '专利申请.pdf', size: 1024000, type: 'application/pdf' }
      ]
    },
    {
      id: 2,
      projectTitle: '机器学习算法优化研究',
      projectID: 'PROJ002',
      projectType: '省级科技计划',
      participants: '李四',
      projectOrg: '某某研究院',
      status: '某某科技公司',
      startDate: '2023-03-01',
      endDate: '2024-12-31',
      funding: '30万元',
      state: '已完成',
      money: '30万元',
      files_projectProposal: [
        { name: '项目合同.pdf', size: 4096000, type: 'application/pdf' }
      ],
      files_progressReport: [
        { name: '结题报告.pdf', size: 6144000, type: 'application/pdf' },
        { name: '技术文档.docx', size: 2560000, type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' }
      ],
      files_achievement: [
        { name: '软件著作权.pdf', size: 1536000, type: 'application/pdf' },
        { name: '技术专利.pdf', size: 2048000, type: 'application/pdf' },
        { name: '产品演示视频.mp4', size: 25600000, type: 'video/mp4' }
      ]
    }
  ];

  const stats = [
    { value: 2, label: '科研项目' },
    { value: 1, label: '国家级' },
    { value: 1, label: '省级' }
  ];

  const columns = [
    {
      key: 'projectTitle',
      title: '项目标题',
      width: '250px',
      render: (value) => (
        <div className="project-page__title">{value}</div>
      )
    },
    { key: 'projectID', title: 'ID', width: '120px' },
    { key: 'projectType', title: '项目类型', width: '120px' },
    { key: 'participants', title: '主持人', width: '150px' },
    { key: 'projectOrg', title: '所属机构', width: '150px' },
    { key: 'status', title: '合作单位', width: '150px' },
    { key: 'startDate', title: '起始时间', width: '100px' },
    { key: 'endDate', title: '终止时间', width: '100px' },
    { key: 'funding', title: '资助金额', width: '100px' },
    { key: 'state', title: '状态', width: '100px' },
    { key: 'money', title: '经费总额', width: '100px' },
    {
      key: 'actions',
      title: '操作',
      width: '120px',
      render: () => (
        <div>
          <a className="data-table__action-link data-table__action-link--edit">编辑</a>
          <a className="data-table__action-link data-table__action-link--delete">删除</a>
        </div>
      )
    }
  ];

  return (
    <PageContainer className="project-page">
      <DataTable
        data={data}
        columns={columns}
        showSearch={true}
        title="科研项目"
        titleIcon="project"
        editType="project"
        searchPlaceholder="搜索项目名称、负责人..."
        filterOptions={['在研', '已完成', '已结题']}
        onNew={() => console.log('新建科研项目')}
        onFilter={() => console.log('筛选科研项目')}
        showPagination={true}
        pageSize={20}
        className="project-page__table"
      />
    </PageContainer>
  );
};

export default ProjectPage;
